/*
 * @Descripttion: 
 * @Author: voanit
 * @Date: 2022-09-06 16:19:51
 * @LastEditors: voanit
 * @LastEditTime: 2022-09-11 16:48:45
 */
// 批量注册组件
import { App } from 'vue'
import { useIntersectionObserver } from "@vueuse/core";

export default {
  install(Vue: App) {
    const components = import.meta.globEager('./*/*.vue')
    Object.keys(components).forEach((key: any) => {
      const com: any = components[key]// 模板对象
      let component = com.default  //组件对象
      Vue.component(component.name, component)
    })

    /* 全局注册自定义指令 */
    Vue.directive('lazy', {
      mounted(el, binding, vnode, prevVnode) {
        console.log(el, binding, 9);
        const { stop } = useIntersectionObserver(
          el,
          ([{ isIntersecting }], observerElement) => {
            if (isIntersecting) {
              stop(); /*只要第一次进入就关闭观察者  */
              el.onerror = function () {
                el.src = 'http://erabbit.itheima.net/img/logo.0940ebb5.png'
              }
              el.src = binding.value
            }
          },
          {
            threshold: 0
          }
        );
      },
    })
  }
}